<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<meta name="keywords" content="">
		<meta name="description" content="">
		<link rel="stylesheet" href="http://cmanage.shinechain.io/vendor/css/weuix.min.css" />
		<link rel="icon" type="image/png" href="http://cmanage.shinechain.io/imgs/favicon.ico" />
		<title>区块链推广管理中心</title>
	</head>
	<style>
		body{
			background: #ffffff;
		}
		.main{
			width: 80%;
			margin: 0 auto;
		}
		.main>.title{
			text-align: center;
			margin-top: 5%;
		}
		#template{
			display: none;
		}
		.block {
			font-size: 25px;
			line-height: 60px;
			height: 60px;
		}
		
		.block:hover {
			background: #f5f5f5;
		}
		
		.block>.ctrl {
			text-align: right;
			display: inline-block;
			float: right;
			height: 100%;
		}
		
		.block .weui_switch {
			vertical-align: middle;
		}
	</style>

	<body>
		<div class='main' style="position: relative;">
			<a href="/telegram.html" style="position: absolute; top: -10px;"><img src="http://cmanage.shinechain.io/imgs/return.jpg" height="48" width="48" style="vertical-align:middle;" /></a>
			<h2 class='title'>竞猜小游戏</h2>
			<br />
			<form enctype="multipart/form-data" method="post">
    <input type="file" name="file" id='upload'/>
    <input type="button" value="开启竞猜" id="btn"/>
</form>
			<div style="width: 250px;float: left;">
			本次竞猜配图(必须)<br /><img id="preview" src="" width="100">
			</div>
			<div align="middle" style="width: 500px;height: 120px;float:left;">
			输入本次竞猜问题<input type="text" id="question" size="30"/><br />
			输入官方注入奖励Token数<input type="text" id="tokenTotal" size="1"/><br />
			输入每注投注金额<input type="text" id="tokenTimes" size="1" /><br />
			竞猜持续多少小时（支持小数点）<input type="text" id="duration" size="1"/><br />
			</div>
			<div align="right" style="width: 400px;height:200px;float: left;">
			输入答案，分行填写，每行即为一个答案，支持多个答案<br />
			<textarea id="answer" cols="40" style="width: 300px;height: 80px;" wrap="hard" ></textarea><br />
			
			</div>
			<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="80%" color=#A9AFBB SIZE=3>
			<br />
	<div style="position: relative;left: 50px;width: auto;float: left;">
		
	<p>规则:上面的参数都要有才能开启竞猜，官方注入奖励直接加入到奖池中。竞猜结束后关闭竞猜，等待管理员选择答案结算，结算时自动发送公告</p>
	<p>规则：管理员可以提前选择答案来提前结束竞猜，正常流程是到达结束时间后，或题目答案出来后管理员选择答案结算</p>
	<p>奖池 = 官方注入奖励+所有用户投注金额 </p>
	<p>赢注奖励 = 结算时，每投中一注赢的奖励=奖池/所有投中答案的注数 </p>
	<p>最终用户得到奖励 = 用户投赢的答案的注数*赢注奖励</p>
	<br />
	竞猜中：
<table id="table" border="1" cellspacing="0" cellpadding="0" align="middle" style="font-size: small;width: 1400px;">
	<tbody>
	   <tr>
	        <th>id</th>
	        <th>问题</th>
	        <th>官方注入</th>
	        <th>每注金额</th>
	        <th>选择答案</th>
	        <th>开始时间</th>
	        <th>结束时间</th>
	    </tr>
    </tbody>
</table>
	以往竞猜：
<table id="table1" border="1" cellspacing="0" cellpadding="0" align="middle" style="font-size: small;width: 1400px;">
	<tbody>
	   <tr>
	        <th>id</th>
	        <th>问题</th>
	        <th>官方注入</th>
	        <th>每注金额</th>
	        <th>选择答案</th>
	        <th>最终答案</th>
	        <th>参与人数</th>
	        <th>总投注</th>
	        <th>奖池</th>
	        <th>开始时间</th>
	        <th>结束时间</th>
	    </tr>
    </tbody>
</table>
</div>

</div>

<script src='http://cmanage.shinechain.io/vendor/js/zepto.min.js'></script>
<script>
$(function(){
	var ip = 'http://bot.shinechain.io';

	var getInfo = function () {
	$.get(ip + '/botApi/getGuess', function(res) {
	var table=document.getElementById("table");
	var data = res.guessNow;
    for(var i=0;i<data.length;i++){
        var row=table.insertRow(table.rows.length);
        var c1=row.insertCell(0);
        c1.innerHTML=data[i].id;
        var c2=row.insertCell(1);
        c2.innerHTML=data[i].question;
         var c3=row.insertCell(2);
        c3.innerHTML=data[i].tokentotal;
        var c4=row.insertCell(3);
        c4.innerHTML=data[i].tokentimes;
         var c5=row.insertCell(4);
         var answerList = data[i].answer.split("**");
         var answerChose = "";
         for(var j=0; j<answerList.length; j++){
         	var link = ip+'/botApi/closeGuess?answer='+answerList[j]+'&guessId='+data[i].id;
         	var links = "<a href='"+link+ "'>"+answerList[j]+"</a>";
         	answerChose += links+" |";
         c5.innerHTML=answerChose;
         }
        
        var c6=row.insertCell(5);
        c6.innerHTML=data[i].starttime;
         var c7=row.insertCell(6);
        c7.innerHTML=data[i].endtime;
       }
    
    	var table1=document.getElementById("table1");
		var data = res.guessEnd;
    for(var i=0;i<data.length;i++){
        var row=table1.insertRow(table.rows.length);
        var c1=row.insertCell(0);
        c1.innerHTML=data[i].id;
        var c2=row.insertCell(1);
        c2.innerHTML=data[i].question;
         var c3=row.insertCell(2);
        c3.innerHTML=data[i].tokentotal;
        var c4=row.insertCell(3);
        c4.innerHTML=data[i].tokentimes;
         var c5=row.insertCell(4);
         var answerList = data[i].answer.split("**");
         var answerChose = "";
         for(var j=0; j<answerList.length; j++){
         	answerChose += answerList[j]+" |";
         c5.innerHTML=answerChose;
         }
        
        var c6=row.insertCell(5);
        c6.innerHTML=data[i].answerfinal;
         var c7=row.insertCell(6);
        c7.innerHTML=data[i].joincount;
        
         var c8=row.insertCell(7);
        c8.innerHTML=data[i].tokentimestotal;
         var c9=row.insertCell(8);
        c9.innerHTML=data[i].tokentotalfinally;
        
         var c10=row.insertCell(9);
        c10.innerHTML=data[i].starttime;
         var c11=row.insertCell(10);
        c11.innerHTML=data[i].endtime;
       }
		})
	}
	getInfo();
	$("#btn").click(function(){
        var formData = new FormData();
        formData.append("file" , $("#upload")[0].files[0]);
        $.ajax({
            type: "POST", // 数据提交类型
            url: ip+"/botApi/guessPhoto", // 发送地址
            data: formData, //发送数据
            async: true, // 是否异步
            processData: false, //processData 默认为false，当设置为true的时候,jquery ajax 提交的时候不会序列化 data，而是直接使用data
            contentType: false, //
            success: function (data) {
   			if(data){
   				
   				
        var question = $('#question').val();
        var tokenTotal = $('#tokenTotal').val();
        var tokenTimes = $('#tokenTimes').val();
        var duration = $('#duration').val();
        var answer = $('#answer').val();
        var jsonArr = {question,tokenTotal,tokenTimes,duration,answer}
        $.ajax({
                url: ip + '/botApi/openGuess',
                type: 'POST',
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                data: JSON.stringify(jsonArr),
                success: function(res) {
                	window.alert(res.msg);
                	location.reload(true);
                },
                error: function(res){
                	window.alert(res.msg);
                },
      		 });
   			}
   			else {
    			alert("保存失败：" + data);
   				}
            },
            error: function(data){
            	alert(data.errorMsg);
            }
        });
        
	});
	$('#upload').change(function(){
  // 获取FileList的第一个元素
    	var f = document.getElementById('upload').files[0];
		var src = window.URL.createObjectURL(f);
		document.getElementById('preview').src = src;
})
})
</script>
</body>
</html>